<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<table id="tt" class="easyui-datagrid" title="角色" style="width:100%;height:100%;"
        data-options="url:'app/role/datas',
                      method:'get',
                      nowrap:true,
                      toolbar:'#tb',
                      fitColumns:true,
                      pagination:true,
                      rownumbers:true,
                      singleSelect:true,
                      pageSize:50,
                      fit:true,
                      remoteSort:false">
    <thead>
        <tr>
            <th data-options="field:'id',hidden:true">#</th>
            <th data-options="field:'role',width:20">角色</th>
            <th data-options="field:'description',width:40">描述</th>
        </tr>
    </thead>
</table>

<!--------------------------------------- toolbar  ------------------------------------------------------>
<div id="tb">
	<table cellspacing="0" cellpadding="0">
		<tr>
			<td><a id="btnAdd" href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true">添加</a></td>
			<td><div class="datagrid-btn-separator"></div></td>
			<td><a id="btnEdit" href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">修改</a></td>
			<td><div class="datagrid-btn-separator"></div></td>
			<td><a id="btnDelete" href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true">删除</a></td>
			<td><div class="datagrid-btn-separator"></div></td>
			<td><a id="btnAllocate" href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true">分配资源</a></td>
		</tr>
	</table>
</div>


<!--------------------------------------- form  ------------------------------------------------------>
<div id="w" class="easyui-window" title="添加/修改" data-options="modal:true,closed:true,footer:'#footer'" style="width:800px;height:500px;padding:10px;">
    <form id="ff" method="post">
        <input type="hidden" name="id" id="id" />
        <table cellpadding="5">
            <tr>
                <td>角色:</td>
                <td><input class="easyui-textbox" type="text" id="role" name="role" style="width:200px;" data-options="required:true"></input></td>
            </tr>
            <tr>
                <td>描述:</td>
                <td><input class="easyui-textbox" type="text" id="description" name="description" style="width:250px; height:100px" data-options="multiline:true"></input></td>
            </tr>
        </table>
    </form>
</div>
<div id="footer" data-options="region:'south',border:false" style="text-align:right;padding:2px;">
    <a id="btnSave" class="easyui-linkbutton"  href="javascript:void(0)" style="width:80px">确定</a>
    <a id="btnCancel" class="easyui-linkbutton"  href="javascript:void(0)" style="width:80px">取消</a>
</div>

<!--------------------------------------- resource tree  ------------------------------------------------------>
<div id="w1" class="easyui-window" title="资源分配" data-options="modal:true,closed:true,footer:'#footer1',collapsible:false,minimizable:false,maximizable:false" style="width:500px;height:500px;">
	<div class="easyui-panel" style="padding:5px; height:100%">
	    <ul id="tree"></ul>
	</div>
</div>
<div id="footer1" data-options="region:'south',border:false" style="text-align:right;padding:2px;">
    <a id="btnSave1" class="easyui-linkbutton"  href="javascript:void(0)" style="width:80px">确定</a>
    <a id="btnCancel1" class="easyui-linkbutton"  href="javascript:void(0)" style="width:80px">取消</a>
</div>

<script type="text/javascript">

$(function($){
    var url;
    var saveOrUpdate = function(){

        $('#ff').form('submit', {
          url : url,
          onSubmit : function() {
            return $(this).form('validate');
          },
          success : function(result) {
            json = JSON.parse(result);
            if (json.status == 0) {
              $.messager.show({
                title : 'Error',
                msg : '服务器出错，请稍后再试'
              });
            } else {
              $('#w').window('close'); // close the dialog
              $('#tt').datagrid('reload'); // reload the data
            }
          }
        });
      }
    
    $("#btnDelete").click(function(){
        var row = $('#tt').datagrid('getSelected');
        if (row){
          $.messager.confirm('提示','确定要删除？',function(r){
            if (r){
                $.ajax({
                    url: 'app/role/delete/' + row.id,
                    type:'post',
                    dataType: "json",
                    success: function(json){
                        if (json.status == 1) {
                            $('#tt').datagrid('reload');
                        } else {
                            $.messager.show({
                            	title : '删除异常',
                                msg : json.message
                            });
                        }
                    },
                    error: function(msg){
                        $.messager.show({
                            title : 'Error',
                            msg : '服务器出错，请稍后再试:' + msg
                        });
                    }
                });
            }
          });
        }
    });
    
    $("#btnEdit").click(function(){
        var row = $('#tt').datagrid('getSelected');
        if (row){
          $('#w').window('open');
          $('#ff').form('load',row);
          url = "app/role/update";
        } else {
        	$.messager.alert('提示',"请选择一条记录");
        }
    });
    
    $("#btnAdd").click(function(){
        $('#w').window('open');
        $('#ff').form('clear');
        url = "app/role/save";
    });
    
    $("#btnCancel").click(function(){
        $('#w').window('close');
    });
    
    $("#btnCancel1").click(function(){
        $('#w1').window('close');
    });
    
    $("#btnSave").click(function(){
        saveOrUpdate();
    });
    
    $("#btnSave1").click(function(){
    	var nodes = $('#tree').tree('getChecked');
    	var resourceIds = [];
    	var data = {};
        for(var i=0; i<nodes.length; i++){
            resourceIds[i] = nodes[i].id;
        }
        data.roleId = $('#tt').datagrid('getSelected').id;
        data.resourceIds = resourceIds;
        $.ajax({
            url: 'app/role/allocate',
            type:'post',
            dataType: "json",
            contentType : 'application/json',
            data: JSON.stringify(data),
            success: function(json){
                if (json.status != 1) {
                    $.messager.show({
                        title : '保存异常',
                        msg : json.message
                    });
                }
                $('#w1').window('close');
            },
            error: function(msg){
                $.messager.show({
                    title : 'Error',
                    msg : '服务器出错，请稍后再试:' + msg
                });
            }
        });
    });
    
    
    $("#btnAllocate").click(function(){
    	var row = $('#tt').datagrid('getSelected');
        if (row){
          $('#w1').window('open');
          $("#tree").tree({
        	  url: 'app/resource/treeRole/' + row.id,
        	  method: 'get',
        	  animate: true,
        	  checkbox: true
          });
        } else {
        	$.messager.alert('提示',"请选择一条记录");
        }
        
    });
})
</script>
